<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/StudentInfo/utils/scripts/flat-ui.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="shortcut icon" href="/StudentInfo/utils/image/favicon.ico" type="image/x-icon"/>
  <meta charset="UTF-8">
  <title>选课管理系统</title>
  <script type="text/javascript" src="/StudentInfo/utils/scripts/flat-ui.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="shortcut icon" href="/StudentInfo/utils/image/favicon.ico" type="image/x-icon"/>
  <meta charset="UTF-8">
  <title>学生信息管理系统</title>

  <!-- 标题图标、CSS、js、jQ
  <link href="/online/image/favicon.ico" rel="shortcut icon">
  <link rel="stylesheet" type="text/css" href="/online/css/main.css">
  <script src="/online/js/fun.js" type="text/javascript"></script>-->
  <script type="text/javascript" src="/StudentInfo/utils/js/jquery-3.3.1.min.js"></script>
  <!-- Loading Bootstrap -->
  <link href="/StudentInfo/utils/css/vendor/bootstrap.min.css" rel="stylesheet">
  <!-- Loading Flat UI Pro -->
  <link href="/StudentInfo/utils/css/flat-ui.css" rel="stylesheet">
  <!-- Loading Flat UI JS -->
  <script type="text/javascript" src="/StudentInfo/utils/scripts/flat-ui.min.js"></script>
  <script type='text/javascript' src='/StudentInfo/utils/scripts/particles.js'></script>
  <link href="/StudentInfo/utils/css/animate.css" rel="stylesheet">
</head>

<body>
<div id="particles-js">
  <canvas class="particles-js-canvas-el" width="1322" height="774" style="width: 100%; height: 100%;"></canvas>
</div>
<jsp:include page="studentLeft.jsp"/>
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <h5>查看已修课程</h5>
      <select id="finishType" name="finishType" onchange="queryFinishCourse()"
              class="form-control select select-primary select-block mbl select2">
        <option value="">全部已修课程</option>
        <option value="pass" <c:if test="${requestScope.finishType=='pass'}">selected</c:if>>所有已通过</option>
        <option value="noPass" <c:if test="${requestScope.finishType=='noPass'}">selected</c:if>>所有挂科</option>
      </select>

      <div id="tips" class="alert alert-info" style="display: block">
        提示：如成绩有误请联系代课教师或管理员
        <a onclick="closeThis()" style="float: right">X</a>
      </div>

      <div class="row">
        <div class="col-md-12">
          <div class="margin:0 15px">
            <table style="overflow:scroll;" class="table table-striped table-hover animated fadeIn">
              <tr>
                <th>课程编号</th>
                <th>课程名</th>
                <th>成绩</th>
                <th>学分</th>
              </tr>
              <c:forEach var="ec" items="${requestScope.endCourseList}" varStatus="loop">
                <tr>
                  <td>${ec.cid }</td>
                  <td>${ec.cname }</td>
                  <td>${ec.grade}</td>
                  <td>${ec.credits}</td>
                </tr>
              </c:forEach>
              <tr>
                <th colspan="3">总学分</th>
                <th colspan="1">${requestScope.totalCredits}</th>
              </tr>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>


  <!-- 显示分页信息 -->
  <div class="row">
    <!--分页文字信息  -->
    <jsp:include page="choosePageNo.jsp"/>
    <!-- 分页条信息 -->
    <div class="col-md-12 pageChose">
      <nav aria-label="Page navigation">
        <ul class="pagination bg-primary">
          <li><a href="/StudentInfo/StudentHandler/endcourse?pageNo=1&pageSize=${pageInfo.pageSize}&finishType=${requestScope.finishType}">首页</a></li>
          <c:if test="${pageInfo.hasPreviousPage }">
            <li><a href="/StudentInfo/StudentHandler/endcourse?pageNo=${pageInfo.pageNum-1}&pageSize=${pageInfo.pageSize}&finishType=${requestScope.finishType}" aria-label="Previous">
              <span aria-hidden="true">上一页</span>
            </a></li>
          </c:if>
          <c:forEach items="${pageInfo.navigatepageNums }" var="page_Num">
            <c:if test="${page_Num == pageInfo.pageNum }">
              <li class="active"><a href="#">${page_Num }</a></li>
            </c:if>
            <c:if test="${page_Num != pageInfo.pageNum }">
              <li><a href="/StudentInfo/StudentHandler/endcourse?pageNo=${page_Num}&pageSize=${pageInfo.pageSize}&finishType=${requestScope.finishType}">${page_Num}</a></li>
            </c:if>
          </c:forEach>
          <c:if test="${pageInfo.hasNextPage }">
            <li><a href="/StudentInfo/StudentHandler/endcourse?pageNo=${pageInfo.pageNum+1}&pageSize=${pageInfo.pageSize}&finishType=${requestScope.finishType}" aria-label="Next"> <span aria-hidden="true">下一页</span>
            </a></li>
          </c:if>
          <li><a href="/StudentInfo/StudentHandler/endcourse?pageNo=${pageInfo.pages}&pageSize=${pageInfo.pageSize}&finishType=${requestScope.finishType}">末页</a></li>
        </ul>
      </nav>
    </div>
  </div>

</div>

<script>
    $(".select2").select2({
        dropdownCssClass : 'dropdown-inverse'
    });

    function closeThis() {
        document.getElementById("tips").style.display="none";

        // 关闭提示的时候，生成一个cookie，过期时间是30分钟
        refreshCookieTime();
    }
    window.onload = function () {
        // 获取cookie中的display的值，如果未空，则cookie过期
        let display = readCookie("display");
        if (display == "none") {
            // 如果没有过期，则刷新过期时间
            refreshCookieTime();

            document.getElementById("tips").style.display="none";
        }
    }

    function queryFinishCourse(){
        let pageSize = $("#pageSize").val();
        let finishType = $("#finishType").val();
        let pageNum = ${pageInfo.pageNum};
        if (pageNum == 0) {
            pageNum = 1;
        }
        window.location.href="/StudentInfo/StudentHandler/endcourse?pageNo=" + pageNum + "&pageSize=" + pageSize
            + "&finishType=" + finishType;
    }

</script>

<script type="text/javascript" src="/StudentInfo/utils/scripts/flat-ui.js"></script>
<script src="/StudentInfo/utils/scripts/bganimation.js"></script>
</body>
</html>